<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>Uniprot2probes</title>
		<link rel="stylesheet" href="css/styles.css" type="text/css" />
        <link rel="stylesheet" href="css/pagination.css" type="text/css" />
		<script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
		<script type="text/javascript" src="js/jsdas.0.1.6.min.js"></script>
		<script type="text/javascript" src="js/control.js"></script>
        <script type="text/javascript" src="js/jquery.pagination.js"></script>
        <link rel="shortcut icon" href="http://cbio.uct.ac.za/favicon.ico" />
	</head>
	<body>
		<section class="inner_frame">
			<section id="uniprot2probes" class="search_forms">
				<header>Uniprot2Probes</header>
				<form>
					Proteins <span id="examples_u2p" class="examples">(e.g. <a class="example">P05067</a>, <a class="example">P99999</a>, <a class="example">P69905</a>)</span>:<br />
					<textarea rows="5" id="proteins_u2p" autofocus></textarea>
					<br />
					<div id="advanced_u2p">
						<div id="advanced_u2p_target">
							Platform:<br /> 
							<select id="platform_u2p" class="platform_list"></select><br /> 
<!--							Type:<br /> 
							<select id="type">
								<option value="fullgenome">Full Genome Array</option>
								<option value="mirna">miRNA Array</option>
								<option value="snp">SNP Array</option>
								<option value="universal">Universal Tag Array</option>
								<option value="expression">Expression Set Array</option>
								<option value="chomosome">Chromosome Array</option>
								<option value="promoter">Promoter Array</option>
								<option value="exon">Exon Array</option>
								<option value="gene">Gene Array</option>
							</select><br /> 
  -->
  							Organism:<br /> 
							<select id="organism_u2p" class="organism_list"></select><br />
						</div>
						<div id="advanced_u2p_link"></div>
						<br />
					</div>
					<div class="buttons">
						<input id="getProbes_u2p" type="button" title="get Probes" value="get Probes" /> 
<!-- 						<input type="button" title="get Chips" value="get Chips" />  -->
					</div>
				</form>
			</section>
			<section id="probes2uniprot" class="search_forms">
				<header>Probes2Uniprot</header>
				<form>
					Probes <span id="examples_p2u" class="examples">(e.g. <a class="example">208905_at</a>, <a class="example">A_23_P37856</a>, <a class="example">ILMN_1730416</a>)</span>:<br />
					<textarea rows="5" id="probes_p2u" autofocus></textarea>
					<br />
					<div id="advanced_p2u">
						<div id="advanced_p2u_target">
							Organism:<br /> 
							<select id="organism_p2u" class="organism_list">
							</select><br />
						</div>
						<div id="advanced_p2u_link"></div>
						<br />
					</div>
					<div class="buttons">
						<input id="getProbes_p2u" type="button" title="get Proteins" value="get Proteins" />
					</div>
				</form>
			</section>
			<section id="ensembl2probes" class="search_forms">
				<header>Ensembl2Probes</header>
				<form>
					Ensembl <span id="examples_e2p" class="examples">(e.g. <a class="example">ENSG00000169246</a>, <a class="example">ENSG00000206172</a>)</span>:<br />
					<textarea rows="5" id="ensmbl_e2p" autofocus></textarea>
					<br />
					<div id="advanced_e2p">
						<div id="advanced_e2p_target">
							Platform:<br /> 
							<select id="platform_e2p" class="platform_list"></select><br />
							Organism:<br /> 
							<select id="organism_e2p" class="organism_list"></select><br />
						</div>
						<div id="advanced_e2p_link"></div>
						<br />
					</div>
					<div class="buttons">
						<input id="getProbes_e2p" type="button" title="get Probes" value="get Probes" /> 
					</div>
				</form>
			</section>
			<section id="probes2ensembl" class="search_forms">
				<header>Probes2Ensembl</header>
				<form>
					Probes <span id="examples_p2e" class="examples">(e.g. <a class="example">8000676</a>, <a class="example">ILMN_1725881</a>, <a class="example">PH_hs_0035119</a>)</span>:<br />
					<textarea rows="5" id="ensmbl_p2e" autofocus></textarea>
					<br />
					<div id="advanced_p2e">
						<div id="advanced_p2e_target">
							Organism:<br /> 
							<select id="organism_p2e"  class="organism_list"></select><br />
						</div>
						<div id="advanced_p2e_link"></div>
						<br />
					</div>
					<div class="buttons">
						<input id="getProbes_p2e" type="button" title="get Genes" value="get Probes" />
					</div>
				</form>
			</section>
		</section>	
		<section class="inner_frame">
			<header>Results</header>
			<section id="results" class="results">
			</section>
		</section>
		<script type="text/javascript">
			$('.organism_list').fillOrganisms();
			$('.platform_list').fillPlatforms();
			$('#advanced_u2p').hider();
			$('#advanced_p2u').hider();
			$('#advanced_e2p').hider();
			$('#advanced_p2e').hider();
			$('#uniprot2probes').topForm();
			$('#probes2uniprot').topForm();
			$('#ensembl2probes').topForm();
			$('#probes2ensembl').topForm();
			$('#examples_u2p > a.example').addExample('proteins_u2p');
			$('#examples_p2u > a.example').addExample('probes_p2u');
			$('#examples_e2p > a.example').addExample('ensmbl_e2p');
			$('#examples_p2e > a.example').addExample('ensmbl_p2e');
			$('#getProbes_u2p').click(function(){
				firstCall=true;
				$('#results').html('<progress>working...</progress>');
				getProbes($('#proteins_u2p').val(),"u2p");
			});
			$('#getProbes_p2u').click(function(){
				firstCall=true;
				$('#results').html('<progress>working...</progress>');
				getProbes($('#probes_p2u').val(),"p2u");
			});
			$('#getProbes_e2p').click(function(){
				firstCall=true;
				$('#results').html('<progress>working...</progress>');
				getProbes($('#ensmbl_e2p').val(),"e2p");
			});
			$('#getProbes_p2e').click(function(){
				firstCall=true;
				$('#results').html('<progress>working...</progress>');
				getProbes($('#ensmbl_p2e').val(),"p2e");
			});
		</script>
	</body>
</html>